# AppKit

> Node.js + React SDK for Databricks Apps. Built for humans and AI.


## Appkit

- [Getting started](/appkit/docs.md): Learn how to get started with AppKit.
- [API reference](/appkit/docs/api.md): This section contains the API reference for the AppKit packages.
- [@databricks/appkit](/appkit/docs/api/appkit.md): Core library for building Databricks applications with type-safe SQL queries,
- [Abstract Class: AppKitError](/appkit/docs/api/appkit/Class.AppKitError.md): Base error class for all AppKit errors.
- [Class: AuthenticationError](/appkit/docs/api/appkit/Class.AuthenticationError.md): Error thrown when authentication fails.
- [Class: ConfigurationError](/appkit/docs/api/appkit/Class.ConfigurationError.md): Error thrown when configuration is missing or invalid.
- [Class: ConnectionError](/appkit/docs/api/appkit/Class.ConnectionError.md): Error thrown when a connection or network operation fails.
- [Class: ExecutionError](/appkit/docs/api/appkit/Class.ExecutionError.md): Error thrown when an operation execution fails.
- [Class: InitializationError](/appkit/docs/api/appkit/Class.InitializationError.md): Error thrown when a service or component is not properly initialized.
- [Abstract Class: Plugin<TConfig>](/appkit/docs/api/appkit/Class.Plugin.md): Base abstract class for creating AppKit plugins
- [Class: ServerError](/appkit/docs/api/appkit/Class.ServerError.md): Error thrown when server lifecycle operations fail.
- [Class: TunnelError](/appkit/docs/api/appkit/Class.TunnelError.md): Error thrown when remote tunnel operations fail.
- [Class: ValidationError](/appkit/docs/api/appkit/Class.ValidationError.md): Error thrown when input validation fails.
- [Function: appKitTypesPlugin()](/appkit/docs/api/appkit/Function.appKitTypesPlugin.md): Vite plugin to generate types for AppKit queries.
- [Function: createApp()](/appkit/docs/api/appkit/Function.createApp.md): Bootstraps AppKit with the provided configuration.
- [Function: isSQLTypeMarker()](/appkit/docs/api/appkit/Function.isSQLTypeMarker.md): Type guard to check if a value is a SQL type marker
- [Interface: BasePluginConfig](/appkit/docs/api/appkit/Interface.BasePluginConfig.md): Base configuration interface for AppKit plugins
- [Interface: CacheConfig](/appkit/docs/api/appkit/Interface.CacheConfig.md): Configuration for caching
- [Interface: ITelemetry](/appkit/docs/api/appkit/Interface.ITelemetry.md): Plugin-facing interface for OpenTelemetry instrumentation.
- [Interface: StreamExecutionSettings](/appkit/docs/api/appkit/Interface.StreamExecutionSettings.md): Configuration for streaming execution with default and user-scoped settings
- [Interface: TelemetryConfig](/appkit/docs/api/appkit/Interface.TelemetryConfig.md): OpenTelemetry configuration for AppKit applications
- [Type Alias: IAppRouter](/appkit/docs/api/appkit/TypeAlias.IAppRouter.md): Express router type for plugin route registration
- [Variable: sql](/appkit/docs/api/appkit/Variable.sql.md): SQL helper namespace
- [@databricks/appkit-ui](/appkit/docs/api/appkit-ui.md): The library provides a set of UI primitives for building Databricks apps in React.
- [AreaChart](/appkit/docs/api/appkit-ui/data/AreaChart.md): Area Chart component for trend visualization with filled areas.
- [BarChart](/appkit/docs/api/appkit-ui/data/BarChart.md): Bar Chart component for categorical comparisons.
- [DataTable](/appkit/docs/api/appkit-ui/data/DataTable.md): Production-ready data table with automatic data fetching and state management
- [DonutChart](/appkit/docs/api/appkit-ui/data/DonutChart.md): Donut Chart component (Pie chart with inner radius).
- [HeatmapChart](/appkit/docs/api/appkit-ui/data/HeatmapChart.md): Heatmap Chart component for matrix-style data visualization.
- [LineChart](/appkit/docs/api/appkit-ui/data/LineChart.md): Line Chart component for time-series and trend visualization.
- [PieChart](/appkit/docs/api/appkit-ui/data/PieChart.md): Pie Chart component for proportional data visualization.
- [RadarChart](/appkit/docs/api/appkit-ui/data/RadarChart.md): Radar Chart component for multi-dimensional data comparison.
- [ScatterChart](/appkit/docs/api/appkit-ui/data/ScatterChart.md): Scatter Chart component for correlation and distribution visualization.
- [Styling](/appkit/docs/api/appkit-ui/styling.md): This guide covers how to style AppKit UI components using CSS variables and theming.
- [Accordion](/appkit/docs/api/appkit-ui/ui/Accordion.md): Collapsible content sections organized in a vertical stack
- [Alert](/appkit/docs/api/appkit-ui/ui/Alert.md): Displays important information with optional icon and multiple variants
- [AlertDialog](/appkit/docs/api/appkit-ui/ui/AlertDialog.md): Modal dialog that interrupts the user with critical information requiring immediate action
- [AspectRatio](/appkit/docs/api/appkit-ui/ui/AspectRatio.md): Container that maintains a specific aspect ratio for its content
- [Avatar](/appkit/docs/api/appkit-ui/ui/Avatar.md): Displays user profile picture or initials in a circular container
- [Badge](/appkit/docs/api/appkit-ui/ui/Badge.md): Small label for displaying status, categories, or counts
- [Breadcrumb](/appkit/docs/api/appkit-ui/ui/Breadcrumb.md): Navigation component showing the current page's location in the site hierarchy
- [Button](/appkit/docs/api/appkit-ui/ui/Button.md): Clickable button with multiple variants and sizes
- [ButtonGroup](/appkit/docs/api/appkit-ui/ui/ButtonGroup.md): Container for grouping related buttons together with shared borders
- [Calendar](/appkit/docs/api/appkit-ui/ui/Calendar.md): Date picker component for selecting single dates or date ranges
- [Card](/appkit/docs/api/appkit-ui/ui/Card.md): Container for grouping related content with header, body, and footer sections
- [Carousel](/appkit/docs/api/appkit-ui/ui/Carousel.md): Slideshow component for cycling through content with navigation controls
- [ChartContainer](/appkit/docs/api/appkit-ui/ui/ChartContainer.md): Container for rendering data visualizations using Recharts
- [Checkbox](/appkit/docs/api/appkit-ui/ui/Checkbox.md): Checkbox input for selecting multiple options
- [Collapsible](/appkit/docs/api/appkit-ui/ui/Collapsible.md): Interactive component that expands and collapses content
- [Command](/appkit/docs/api/appkit-ui/ui/Command.md): Command palette for keyboard-driven navigation and actions
- [ContextMenu](/appkit/docs/api/appkit-ui/ui/ContextMenu.md): Menu triggered by right-clicking an element
- [Dialog](/appkit/docs/api/appkit-ui/ui/Dialog.md): Modal dialog that overlays the page content
- [Drawer](/appkit/docs/api/appkit-ui/ui/Drawer.md): Draggable panel that slides in from screen edges
- [DropdownMenu](/appkit/docs/api/appkit-ui/ui/DropdownMenu.md): Menu that displays when triggered by a button or element
- [Empty](/appkit/docs/api/appkit-ui/ui/Empty.md): Empty state component for displaying no-data scenarios
- [Field](/appkit/docs/api/appkit-ui/ui/Field.md): Form field wrapper with label and input positioning
- [FormControl](/appkit/docs/api/appkit-ui/ui/FormControl.md): Wrapper for form control elements with accessibility attributes
- [HoverCard](/appkit/docs/api/appkit-ui/ui/HoverCard.md): Content card that appears when hovering over an element
- [Input](/appkit/docs/api/appkit-ui/ui/Input.md): Text input field for single-line user input
- [InputGroup](/appkit/docs/api/appkit-ui/ui/InputGroup.md): Container for combining input fields with addons and buttons
- [InputOTP](/appkit/docs/api/appkit-ui/ui/InputOTP.md): One-time password input with individual character slots
- [Item](/appkit/docs/api/appkit-ui/ui/Item.md): Flexible container for list items with media, content, and actions
- [Kbd](/appkit/docs/api/appkit-ui/ui/Kbd.md): Visual representation of keyboard keys
- [Label](/appkit/docs/api/appkit-ui/ui/Label.md): Text label associated with form controls
- [Menubar](/appkit/docs/api/appkit-ui/ui/Menubar.md): Horizontal menu bar with dropdown menus
- [NavigationMenu](/appkit/docs/api/appkit-ui/ui/NavigationMenu.md): Horizontal navigation menu with dropdown submenus
- [Pagination](/appkit/docs/api/appkit-ui/ui/Pagination.md): Navigation component for paginated content
- [Popover](/appkit/docs/api/appkit-ui/ui/Popover.md): Floating content panel anchored to a trigger element
- [Progress](/appkit/docs/api/appkit-ui/ui/Progress.md): Visual indicator showing task completion percentage
- [RadioGroup](/appkit/docs/api/appkit-ui/ui/RadioGroup.md): Group of radio buttons for selecting a single option
- [ResizableHandle](/appkit/docs/api/appkit-ui/ui/ResizableHandle.md): Draggable handle for resizing panels
- [ScrollArea](/appkit/docs/api/appkit-ui/ui/ScrollArea.md): Container with custom scrollbars for overflow content
- [Select](/appkit/docs/api/appkit-ui/ui/Select.md): Dropdown control for selecting a value from a list
- [Separator](/appkit/docs/api/appkit-ui/ui/Separator.md): Visual divider line between content sections
- [Sheet](/appkit/docs/api/appkit-ui/ui/Sheet.md): Sliding panel that overlays content from screen edges
- [Sidebar](/appkit/docs/api/appkit-ui/ui/Sidebar.md): Collapsible navigation sidebar with mobile support
- [Skeleton](/appkit/docs/api/appkit-ui/ui/Skeleton.md): Loading placeholder with pulsing animation
- [Slider](/appkit/docs/api/appkit-ui/ui/Slider.md): Draggable input for selecting numeric values within a range
- [Spinner](/appkit/docs/api/appkit-ui/ui/Spinner.md): Animated loading indicator
- [Switch](/appkit/docs/api/appkit-ui/ui/Switch.md): Toggle control for switching between on and off states
- [Table](/appkit/docs/api/appkit-ui/ui/Table.md): Structured data display with rows and columns
- [Tabs](/appkit/docs/api/appkit-ui/ui/Tabs.md): Tabbed interface for organizing content into separate panels
- [Textarea](/appkit/docs/api/appkit-ui/ui/Textarea.md): Multi-line text input field
- [Toaster](/appkit/docs/api/appkit-ui/ui/Toaster.md): Toast notification system for displaying temporary messages
- [Toggle](/appkit/docs/api/appkit-ui/ui/Toggle.md): Button that toggles between pressed and unpressed states
- [ToggleGroup](/appkit/docs/api/appkit-ui/ui/ToggleGroup.md): Group of toggle buttons for selecting one or more options
- [Tooltip](/appkit/docs/api/appkit-ui/ui/Tooltip.md): Brief informational message that appears on hover
- [App management](/appkit/docs/app-management.md): Manage your AppKit application throughout its lifecycle using the Databricks CLI. This guide covers deploying, starting, stopping, monitoring, and deleting apps.
- [Architecture](/appkit/docs/architecture.md): AppKit follows a plugin-based architecture designed for building production-ready Databricks applications. This document provides a high-level overview of the system components and their interactions.
- [Development](/appkit/docs/category/development.md): Guides for developing AppKit applications
- [Configuration](/appkit/docs/configuration.md): This guide covers environment variables and configuration options for AppKit applications.
- [Core principles](/appkit/docs/core-principles.md): Learn about the fundamental concepts and principles behind AppKit.
- [Development](/appkit/docs/development.md): AppKit provides multiple development workflows to suit different needs: local development with hot reload, AI-assisted development with MCP, and remote tunneling to deployed backends.
- [LLM Guide](/appkit/docs/development/llm-guide.md): This document provides prescriptive guidance for AI coding assistants generating code with Databricks AppKit. It is intentionally opinionated to ensure consistent, production-ready code generation.
- [Local development](/appkit/docs/development/local-development.md): Once your app is bootstrapped according to the Manual quick start guide, you can start the development server with hot reload for both UI and backend code.
- [Project setup](/appkit/docs/development/project-setup.md): This guide covers the recommended project structure and scaffolding for AppKit applications.
- [Remote Bridge](/appkit/docs/development/remote-bridge.md): Remote bridge allows you to develop against a deployed backend while keeping your UI and queries local. This is useful for testing against production data or debugging deployed backend code without redeploying your app.
- [Type generation](/appkit/docs/development/type-generation.md): AppKit can automatically generate TypeScript types for your SQL queries, providing end-to-end type safety from database to UI.
- [Plugins](/appkit/docs/plugins.md): Plugins are modular extensions that add capabilities to your AppKit application. They follow a defined lifecycle and have access to shared services like caching, telemetry, and streaming.